<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style type="text/css">
			* {margin: 0;padding: 0;}
			.container {
				position: absolute;
				width: 100%;
				height: 100%;
				background-color: #008000;
			}
			/* box-shadow: h-shadow v-shadow blur spread color inset; 
				h-shadow:水平阴影的位置，允许负值。
				v-shadow:垂直阴影的位置，允许负值。
				blur:模糊距离。
				spread:阴影的尺寸。
				color:阴影的颜色。
				inset:将外部阴影 (outset) 改为内部阴影。
				IE9+、Firefox 4、Chrome、Opera 以及 Safari 5.1.1 支持 box-shadow 属性。
			*/
			.box1,.box2,.box3 {
				width: 300px;
				height: 300px;
				border: 1px black solid;
				float: left;
			}
			.box1 {
				box-shadow: 0px 0px 40px 10px #007AFF inset;
			}
			.box2 {
				margin: 100px;
				box-shadow: 30px 30px 40px 10px #007AFF inset;
			}
			.box3 {
				margin: 100px;
				box-shadow: 30px 30px 40px 10px #007AFF;
			}
		</style>
	</head>
	<body>
		<div class="container">
			<div class="box1">
				
			</div>
			<div class="box2">
				
			</div>
			<div class="box3">
				
			</div>
		</div>
		
	</body>
</html>